<template>
	<view>
		<view class="box">
			<view style="height: 100rpx;">
				<view class="serchBox plr30 ptb20 flex">
					<u-search placeholder="输入关键字搜索" v-model="pageList.keywords" shape="square" :showAction="false"
						style="width: calc(100% - 170rpx)"></u-search>
					<view class="btn" @click="handleSerch">搜索</view>
				</view>
			</view>
			<view style="margin-top: 20vh;" v-if="!loadingPage">
				<u-empty mode="list"></u-empty>
			</view>
			<base-loading :flag="showLoading" />
			<view v-if="loadingPage">
				<hasCard @itemDetails="fileForDetails" :list="lampArr"></hasCard>
			</view>
		</view>
	</view>
</template>

<script>
	import hasCard from "./components/has-card.vue"
	export default {
		components: {
			hasCard
		},
		data() {
			return {
				keyword: '',
				lampArr: [],
				itemCount: 0, //总数
				pageList: {
					keywords: '',
					pageIndex: 1,
					pageSize: 10,
					pageType: 2
				},
				showLoading: false,
				loadingPage: false,
				getDictsByCodeYHLY: [],
				getDictsByCodeYHZY: []
			}
		},
		onShow() {
			this.init()
		},
		onReachBottom() {
			console.log('到底')
			if (this.itemCount > this.lampArr.length) {
				this.pageList.pageIndex++
				this.requestList()
			}
		},
		methods: {
			toJSON() {},
			init() {
				uni.pageScrollTo({
					scrollTop: 0,
					duration: 300
				})
				this.lampArr = []
				this.pageList.pageIndex = 1
				this.requestList()
			},
			loading() {
				if (this.lampArr[0]) {
					this.loadingPage = true
				} else {
					this.loadingPage = false
				}
			},
			async requestList() {
				this.showLoading = true
				let {
					resultValue: res
				} = await this.request(this.$api.getHiddenDangerBackLogAndDonePageList, this.pageList, 'GET')
				// console.log('res123',res.items)
				setTimeout(() => {
					this.lampArr = this.lampArr.concat(res.items)
					this.itemCount = res.itemCount
					this.getDictsByCode()
					this.loading()
					this.showLoading = false
					console.log(this.lampArr, 123)
				}, 300)
			},
			async getDictsByCode() {
				let data = {}
				if (!this.getDictsByCodeYHLY[0]) {
					data = {typeCode: "YHLY"}; //隐患来源
					let {resultValue: res} = await this.request(this.$api.getDictsByCode, data, "POST")
					this.getDictsByCodeYHLY = res.items
				}
				if (!this.getDictsByCodeYHZY[0]) {
					data = {typeCode: "YHZY"}; //隐患分类
					let {resultValue: res1} = await this.request(this.$api.getDictsByCode, data, "POST")
					this.getDictsByCodeYHZY = res1.items
				}
				this.lampArr.forEach((item) => {
					this.getDictsByCodeYHLY.forEach((i) => {
						if (item.hiddenDangerRourceDesc == i.dicCode) {
							item.hiddenDangerRourceDesc = i.dicName
						}
					})
					this.getDictsByCodeYHZY.forEach((i) => {
						if (item.hiddenDangerTypeDesc == i.dicCode) {
							item.hiddenDangerTypeDesc = i.dicName
						}
					})
				})
			},
			//搜索框
			handleSerch() {
				this.pageList.pageIndex = 1
				this.lampArr = []
				this.requestList()
			},
			fileForDetails(e) {
				uni.navigateTo({
					url: './fileForDetails?flag=1&hiddenDangerId=' + e[0].hiddenDangerId
				})
			},
		}
	}
</script>

<style scoped>
	.box {
		min-height: 100vh;
		background-color: #F1F2F5;
	}

	.serchBox {
		box-sizing: border-box;
		background-color: #fff;
		height: 100rpx;
		position: fixed;
		width: 100%;
		z-index: 520;
		box-shadow: 0 1px 11px 0 rgba(0, 0, 0, 0.09);
	}

	.tabsBox {
		box-sizing: border-box;
		height: 100rpx;
		position: fixed;
		width: 100%;
		background-color: #FFFFFF;
		z-index: 520;
	}

	>>>.u-tabs__wrapper__nav__item {
		padding: 0 15rpx !important;
	}

	>>>.u-tabs__wrapper__nav__item__text {
		font-size: 30rpx !important
	}

	>>>.u-badge--not-dot {
		padding: 4rpx 8rpx;
	}

	.btn {
		width: 140rpx;
		height: 68rpx;
		line-height: 68rpx;
		border-radius: 6px;
		background-color: #3473F9;
		color: #fff;
		text-align: center;
		margin: -4rpx 0 0 20rpx;
		font-size: 28rpx;
	}
</style>
